import SwiftUI

struct ArticleDetailView: View {
    let article: Article
    @State private var showingComments = false
    
    var body: some View {
        ScrollView {
            VStack(alignment: .leading, spacing: 16) {
                // 文章头部
                VStack(alignment: .leading, spacing: 12) {
                    Text(article.title)
                        .font(.title)
                        .bold()
                    
                    HStack {
                        HStack(spacing: 4) {
                            Image(systemName: "person.circle.fill")
                            Text(article.author)
                        }
                        
                        Spacer()
                        
                        Text(article.date)
                            .foregroundColor(.secondary)
                    }
                    .font(.subheadline)
                }
                .padding(.bottom)
                
                // 文章内容
                Text(article.content)
                    .lineSpacing(8)
                
                // 标签
                ScrollView(.horizontal, showsIndicators: false) {
                    HStack(spacing: 8) {
                        ForEach(article.tags, id: \.self) { tag in
                            Text(tag)
                                .font(.caption)
                                .padding(.horizontal, 12)
                                .padding(.vertical, 6)
                                .background(Color.blue.opacity(0.1))
                                .foregroundColor(.blue)
                                .cornerRadius(15)
                        }
                    }
                }
                
                Divider()
                    .padding(.vertical)
                
                // 相关推荐
                VStack(alignment: .leading, spacing: 12) {
                    Text("相关推荐")
                        .font(.headline)
                    
                    ForEach(article.relatedArticles) { related in
                        NavigationLink(destination: ArticleDetailView(article: related)) {
                            HStack {
                                VStack(alignment: .leading, spacing: 4) {
                                    Text(related.title)
                                        .lineLimit(2)
                                        .foregroundColor(.primary)
                                    Text(related.author)
                                        .font(.caption)
                                        .foregroundColor(.secondary)
                                }
                                Spacer()
                                Image(systemName: "chevron.right")
                                    .foregroundColor(.secondary)
                            }
                            .padding()
                            .background(Color(.systemGray6))
                            .cornerRadius(10)
                        }
                    }
                }
            }
            .padding()
        }
        .navigationBarTitleDisplayMode(.inline)
        .toolbar {
            ToolbarItem(placement: .navigationBarTrailing) {
                Menu {
                    Button(action: {}) {
                        Label("收藏文章", systemImage: "bookmark")
                    }
                    Button(action: {}) {
                        Label("分享", systemImage: "square.and.arrow.up")
                    }
                    Button(action: {
                        showingComments = true
                    }) {
                        Label("查看评论", systemImage: "bubble.left")
                    }
                } label: {
                    Image(systemName: "ellipsis")
                }
            }
        }
        .sheet(isPresented: $showingComments) {
            CommentsView(article: article)
        }
    }
}

struct CommentsView: View {
    let article: Article
    @Environment(\.presentationMode) var presentationMode
    @State private var newComment = ""
    
    var body: some View {
        NavigationView {
            List {
                Section {
                    ForEach(article.comments) { comment in
                        VStack(alignment: .leading, spacing: 8) {
                            HStack {
                                Image(systemName: "person.circle.fill")
                                    .foregroundColor(.blue)
                                Text(comment.author)
                                    .font(.subheadline)
                                Spacer()
                                Text(comment.date)
                                    .font(.caption)
                                    .foregroundColor(.secondary)
                            }
                            
                            Text(comment.content)
                                .font(.body)
                            
                            HStack(spacing: 16) {
                                Button(action: {}) {
                                    HStack {
                                        Image(systemName: "hand.thumbsup")
                                        Text("\(comment.likes)")
                                    }
                                }
                                
                                Button(action: {}) {
                                    HStack {
                                        Image(systemName: "bubble.left")
                                        Text("回复")
                                    }
                                }
                            }
                            .font(.caption)
                            .foregroundColor(.secondary)
                        }
                        .padding(.vertical, 4)
                    }
                }
                
                Section {
                    HStack {
                        TextField("写下你的评论...", text: $newComment)
                        Button("发送") {
                            // 发送评论
                            newComment = ""
                        }
                        .disabled(newComment.isEmpty)
                    }
                }
            }
            .navigationTitle("评论")
            .navigationBarItems(trailing: Button("完成") {
                presentationMode.wrappedValue.dismiss()
            })
        }
    }
}

// 模型
struct Article: Identifiable {
    let id = UUID()
    let title: String
    let author: String
    let date: String
    let content: String
    let tags: [String]
    let relatedArticles: [Article]
    let comments: [Comment]
    
    static let preview = Article(
        title: "修炼基础：内息运行要诀",
        author: "大师兄",
        date: "2024-01-13",
        content: """
        修炼之道，贵在坚持。本文将详细介绍内息运行的基本要诀，帮助初学者打好基础。
        
        首先，我们要明确内息运行的关键点：
        
        1. 呼吸调节
        调息为先，呼吸要缓慢均匀，不可急促。初学者可以采用腹式呼吸，随着呼吸感受气息的流动。
        
        2. 心神专注
        修炼时要排除杂念，将注意力集中在气息运行的路径上。可以选择一个安静的环境，闭目凝神。
        
        3. 循序渐进
        内息运行要遵循由浅入深的原则，不可急于求成。初期可以从小周天开始，待基础打牢后再尝试大周天。
        
        4. 注意事项
        - 修炼时间要适度，不可过度疲劳
        - 保持正确的姿势，避免气息紊乱
        - 如果感觉不适，要及时调整或停止
        
        希望这些要诀能够帮助大家在修炼道路上更进一步。
        """,
        tags: ["基础入门", "内息", "修炼要诀"],
        relatedArticles: [],
        comments: [
            Comment(author: "小师妹", date: "2024-01-13", content: "写得很详细，对初学者很有帮助！", likes: 12),
            Comment(author: "修炼者", date: "2024-01-13", content: "请问内息运行时出现胸闷是什么原因？", likes: 8)
        ]
    )
}

struct Comment: Identifiable {
    let id = UUID()
    let author: String
    let date: String
    let content: String
    let likes: Int
}

